<!-- 侧栏app下载链接 -->
<template>
  <sidebar-block>
    <a href="https://juejin.cn/app" target="_blank">
      <div class="app-link">
          
        <img class="qr-img" src="//lf3-cdn-tos.bytescm.com/obj/static/xitu_juejin_web/img/article.9d13ff7.png" alt="">
        <div class="content-box">
          <div class="headline">下载稀土掘金APP</div>
          <div class="desc">一个帮助开发者成长的社区</div>
        </div>
          
      </div>
    </a>
  </sidebar-block>
</template>

<script>
import SidebarBlock from './SidebarBlock.vue';

export default {
  name:'AppLink',
  data () {
    return {
    }
  },
  components:{
    SidebarBlock
  }
}
</script>

<style  scoped>
.sidebar-block .app-link {
    padding: 20px;
    display: flex;
    align-items: center;
    padding: 1rem;
}

.qr-img{
    margin-right: 16px;
    width: 50.004px;
    height: 50.004px;
}

.headline{
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
    color: #1d2129;
}

.desc {
    font-size: 14.004px;
    line-height: 22px;
    margin-top: 4px;
    color: #8a919f;
}

.app-link {
    display: flex;
    align-items: center;
    padding: 12px;
}
</style>
